form nz-form [formGroup]="validateForm">
<nz-form-item>
    <nz-form-label [nzSpan]="7" nzRequired>姓名</nz-form-label>
    <nz-form-control [nzSpan]="12" nzHasFeedback nzValidatingTip="验证中..." [nzErrorTip]="userErrorTpl">
        <input nz-input formControlName="userName" placeholder="姓名" />
        <ng-template #userErrorTpl let-control>
            <ng-container *ngIf="control.hasError('required')">
                请输入您的姓名
            </ng-container>
            <ng-container *ngIf="control.hasError('duplicated')">
                The username is redundant!
            </ng-container>
        </ng-template>
    </nz-form-control>
</nz-form-item>
<nz-form-item>
    <nz-form-label [nzSpan]="7" nzRequired>账号</nz-form-label>
    <nz-form-control [nzSpan]="12" nzHasFeedback nzValidatingTip="验证中 ..." nzErrorTip="请输入你的账号">
        <input nz-input formControlName="number" placeholder="账号" />
        <ng-template #userErrorTpl let-control>
            <ng-container *ngIf="control.hasError('required')">
                请输入你的账号
            </ng-container>
            <ng-container *ngIf="control.hasError('duplicated')">
                The username is redundant!
            </ng-container>
        </ng-template>
    </nz-form-control>
</nz-form-item>
<nz-form-item>
    <nz-form-label [nzSpan]="7" nzRequired>密码</nz-form-label>
    <nz-form-control [nzSpan]="12" nzHasFeedback nzErrorTip="请输入你的密码">
        <input nz-input type="password" placeholder="密码" formControlName="password"
            (ngModelChange)="validateConfirmPassword()" />
    </nz-form-control>
</nz-form-item>
<nz-form-item>
    <nz-form-label [nzSpan]="7" nzRequired>确认密码</nz-form-label>
    <nz-form-control [nzSpan]="12" nzHasFeedback nzErrorTip="密码不一致">
        <input nz-input type="password" formControlName="confirm" placeholder="确认密码" />
        <ng-template #passwordErrorTpl let-control>
            <ng-container *ngIf="control.hasError('required')">
                请确认你的密码
            </ng-container>
            <ng-container *ngIf="control.hasError('confirm')">
                密码不一致
            </ng-container>
        </ng-template>
    </nz-form-control>
</nz-form-item>
<nz-form-item>
    <nz-form-label [nzSpan]="7" nzRequired>状态</nz-form-label>
    <app-radio #radio></app-radio>
</nz-form-item>
<nz-form-item>
    <nz-form-control [nzOffset]="7" [nzSpan]="12">
        <button nz-button nzType="primary" [disabled]="!validateForm.valid"
            (click)="addOrEditUser($event)">{{buttonName}}</button>
        <button nz-button (click)="resetForm($event)">清空内容</button>
    </nz-form-control>
</nz-form-item>
</form>